<template>
  <div class="block" style="width: 100%">
    <el-timeline>
      <el-timeline-item v-for="item in operateList" :key="item.id" :color="item.type === 'BACK'?'red':'green'" :timestamp="item.createTime" placement="top">
        <el-card>
          <h4 v-if="item.currentNodeType === 'START'">  {{ item.currentNodeName }} - <span style="color:green">【发起申请】</span></h4>
          <h4 v-else>{{ item.currentNodeName }} - 审批状态:
            <span v-if="item.type === 'ALLOW'" style="color:green"> 【{{ item.type | exchange }}】 </span>
            <span v-else style="color:red"> 【{{ item.type | exchange }}】 </span>
          </h4>
          <p>{{ item.message }}</p>
          <h4>操作人: {{ item.createUserName }} </h4>
           <!-- add by jiang 20210623  -->
          <h4>从属企业: {{item.enterPriseName }} </h4>
        </el-card>
      </el-timeline-item>
    </el-timeline>
  </div>
</template>

<script>

import { GetFlowOprateList } from '@/api/SystemManagerApi'

const operatorDic = {
  'ALLOW': '同意',
  'BACK': '打回'
}

export default {
  name: 'FlowOperateList',
  filters: {
    exchange(val) {
      return operatorDic[val]
    }
  },
  props: ['instanceId'],
  data() {
    return {
      operateList: []
    }
  },
  created() {
    this.initData()
  },
  methods: {
    initData() {
      if (this.instanceId) {
        GetFlowOprateList(this.instanceId).then((res) => {
          this.operateList = res.data
        })
      }
    }
  }
}
</script>

<style scoped>

</style>
